<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录</title>
    <link href="./css/login.css" rel="stylesheet">
</head>
<body>
<div id="main">
    <h1 id="title">江南展</h1>
    <form>
        <label>
            用户名:
            <input class="put" id="accountName" placeholder="请输入用户名" required size="25" type="text" name="username">
        </label>
        <div id="wrong1"></div>
        <br>
        <label>
            密&nbsp;&nbsp;码:
            <input class="put" id="password" placeholder="请输入6~16位密码" required size="25" type="password" name="password">
        </label>
        <div id="wrong2"></div>
        <br>
        <label>
            <input name="remember" type="checkbox" id="remember">
            记住我
        </label>
        <a href="#" id="forget">忘记密码?</a>
        <p id="wrong3"></p>
        <a href="register.html" target="_blank"><input id="register" name="register" type="button" value="注册"></a>
        <input id="login" name="login" type="button" value="登录" formtarget="_self">
    </form>
</div>
<script src="https://cdn.staticfile.org/jquery/3.4.0/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
<script src="js/jquery-1.11.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/js-cookie@rc/dist/js.cookie.min.js"></script>
<script src="js/login.js"></script>
<script type="text/javascript">
    $(function () {
        if (Cookies.get("userName")==="admin"&&Cookies.get("userPW")==="zhu123456"){
            window.location.href = 'index.html'
            alert("欢迎您：访客");
        }
    })
    let name = /^[a-zA-Z][a-zA-Z0-9_]{4,15}$/;
    let psw = /^[a-zA-Z]\w{5,17}$/;
    let accountName = document.getElementById('accountName');
    let password = document.getElementById('password');
    let login = document.getElementById('login');
    let wrong1 = document.getElementById('wrong1');
    let wrong2 = document.getElementById('wrong2');
    let wrong3 = document.getElementById('wrong3');
    accountName.onfocus = function () {
        wrong1.innerHTML = ""
    }
    accountName.onblur = function () {
        if (!name.test(this.value)) {
            wrong1.innerHTML = "请输入以字母开头,5-16位字母、数字、下划线"
        }
    }
    password.onfocus = function () {
        wrong2.innerHTML = ""
    }
    password.onblur = function () {
        if (!psw.test(this.value)) {
            wrong2.innerHTML = "请输入以字母开头,6~18位字母、数字、下划线"
        }
    }
    login.onclick = function () {
        if (accountName.value !== "admin" || password.value !== "zhu123456") {
            wrong3.innerHTML = "!用户名或密码错误";
        } else {
            Save();
            window.alert("登陆成功!");
            window.location.href = 'index.html'
        }
    }
</script>

</body>
</html>